// pages/park/park.ts
Page({

  /**
   * 页面的初始数据
   */
  data: {
    markers:[],
    firstId: {},
    listData: [
      {
        pid: 1,
        parkAddress: "四川省成都市武侯区世纪城路88号",
        parkPrice: 5,
        longitude: 104.06658951451111,
        latitude: 30.55960020795108,
        spaceDiscount: 0.8,
        distance: 114514,
        parkName: "成都世纪城天堂洲际大饭店",
        maxSpace: 100,
        nowSpace: 10
      },
      {
        pid: 2,
        parkAddress: "四川省成都市武侯区天府三街198号腾讯成都大厦A座",
        parkPrice: 10,
        longitude: 104.06409278175353,
        latitude: 30.547435122863167,
        spaceDiscount: 0.7,
        distance: 10086,
        parkName: "成都腾讯大厦A座",
        maxSpace: 180,
        nowSpace: 20
      },
      {
        pid: 3,
        parkAddress: "四川省成都市武侯区天府三街19号",
        parkPrice: 10,
        longitude: 104.06757908961869,
        latitude: 30.54637029617519,
        spaceDiscount: 0.7,
        distance: 10086,
        parkName: "新希望国际A座",
        maxSpace: 180,
        nowSpace: 20
      },
      {
        pid: 4,
        parkAddress: "成都市武侯区天府五街与益州大道南段交叉路口往西约100米天府软件园G区南区8栋(天府软件园G区南侧约100米)",
        parkPrice: 10,
        longitude: 104.055408,
        latitude: 30.538109,
        spaceDiscount: 0.7,
        distance: 10086,
        parkName: "天府软件园-G8楼",
        maxSpace: 180,
        nowSpace: 20
      }
    ]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad() {

  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    wx.getLocation({
      type: "gcj02",
      // type: "wgs84",
      isHighAccuracy: true,
      success: res => {
        console.log("定位成功：",res);
        this.setData({
          latitude: res.latitude,
          longitude: res.longitude,
        })
        // 标记当前位置
        let markers:any = this.data.markers;
        markers[0] = {
          id: 0,
          title: "我的位置",
          longitude: res.longitude,
          latitude: res.latitude,
          iconPath: "../../assets/local.png",
          width: 50,
          height: 50,
          zIndex: 99,
        }
        // 遍历附近停车场列表，push数据绘制坐标
        this.data.listData.forEach(item => {
          let obj:any = {};
          obj.id = item.pid;
          obj.title = item.parkName;
          obj.longitude = item.longitude;
          obj.latitude = item.latitude;
          obj.iconPath = "../../assets/local-p.png";
          obj.width = 50;
          obj.height = 50;
          // console.log(obj);  
          markers.push(obj)
        });
        this.setData({markers});
      },
      fail: res => {
        console.log("定位失败：",res);
      }
    })
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },
  // 点击子组件每条停车场信息，获取点击的地址信息的id
  getPid(e:any) {
    // console.log("eeee == ",e.detail);
    // 调用change方法，改变目标颜色
    this.change(e.detail)
    // 调用order方法，列表排序，目标对象置顶
    this.order(e.detail)
  },

  // 点击marker的事件 获取点击的markerId
  markertap(e:any) {
    // console.log("marker e ==",e);
    // 调用change方法，改变目标颜色
    this.change(e.markerId)
    // 调用order方法，列表排序，目标对象置顶
    this.order(e.markerId)
  },

  // 封装点击list或者marker移动地图中心点，改变marker颜色的方法
  change(e:any) {
    let markers:any = this.data.markers;
    // 遍历标记点数组
    markers.forEach((v:any) => {
      if (v.id === e) {
      // 目标停车场改变颜色为红色
      v.iconPath = "../../assets/local-s.png";
      // 移动地图中心为当前点击的停车场（这里调用方法需要设置 map组件id，此处为“myMap）
      wx.createMapContext("myMap",this).moveToLocation({longitude:v.longitude,latitude:v.latitude})
    }else {
      // 其余停车场颜色为橙色
      v.iconPath = "../../assets/local-p.png";
    }
  })
  // 我的位置颜色为绿色
  markers[0].iconPath = "../../assets/local.png";
  this.setData({markers});
  },

  // 封装修改列表的方法
  order(v:any) {
    // 返回点击对象在listData的索引
    console.log("v === ", v);
    // 防止用户因为点击自身的marker，而push一个错误对象到listData
    if (v >= 1) {
      let i = this.data.listData.findIndex((k:any) => {return v == k.pid})
      let listData:any = this.data.listData;
      // 根据索引取出点击对象，使用变量存储
      let first = listData[i]
      let firstId:any = {pid:first.pid}
      this.setData({firstId})
    }
    // wx.pageScrollTo({
    //   scrollTop: 100,
    //   duration: 300
    // })
  }
})